import React from 'react';
import { NavLink, Outlet } from 'react-router-dom';

import routes from '@/router'
import { DiscoverTopWrapper, DiscoverContentWrapper } from './style'
// import DiscoverRank from './rank'
// import DiscoverRec from './recommend';
export default function MDiscover(props) {
  const discoverRoutes = routes[0].children
  const nav = discoverRoutes.map((item, index) => {
    return <NavLink key={item.name} to={item.path} className='list-item'>{item.name}</NavLink>
  })
  return <div>
    <DiscoverTopWrapper>
      <nav className='wrap-w2 discoverNav'>
        {nav}
      </nav>
    </DiscoverTopWrapper>
    <DiscoverContentWrapper>
    <Outlet />
    </DiscoverContentWrapper>
  </div>;
}


